<script lang="ts" setup>
import { FullScreenTwo } from '@icon-park/vue-next'

// Define emits with proper typing
const emit = defineEmits<{
  (e: 'open'): void
}>()

// Define props with TypeScript interfaces
defineProps({
  index: {
    type: Number,
    required: true,
  },
  expand: {
    type: Boolean,
    default: false,
  },
})

const handleExpand = (): void => {
  emit('open')
}
</script>

<template>
  <div class="table-index">
    <div class="row-index">{{ index }}</div>
    <div class="row-expand-btn" v-if="expand">
      <el-tooltip class="box-item" effect="dark" content="展开记录" placement="top">
        <full-screen-two
          class="cursor-pointer"
          theme="outline"
          size="18"
          fill="#999"
          @click="handleExpand"
        />
      </el-tooltip>
    </div>
  </div>
</template>
